<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>节点公有属性</title>
</head>

<body>
    <script>
        // nodeValue属性返回一个字符串，表示当前节点本身的文本值，该属性可读写
        // <div id="box">hello world</div>
        var box = document.getElementById('box');
        box.nodeValue // null
        box.firstChild.nodeValue // "hello world"-->因为还有一个文本节点text 

        // textContent属性返回当前节点和它的所有后代节点的文本内容
        // <div id="box">This is <span>some</span> text</div>
        document.getElementById('box').textContent // This is some text

        // Node.nextSibling属性返回紧跟在当前节点后面的第一个同级节点。如果当前节点后面没有同级节点，则返回null

        // previousSibling属性返回当前节点前面的，距离最近的一个同级节点。如果当前节点前面没有同级节点，则返回null

        // parentNode属性返回当前节点的父节点。对于一个节点来说，它的父节点只可能是三种类型：元素节点（element）、文档节点（document）和文档片段节点（documentfragment）

        // firstChild属性返回当前节点的第一个子节点，如果当前节点没有子节点，则返回null

        // hildNodes属性返回一个类似数组的对象（NodeList集合），成员包括当前节点的所有子节点

        // appendChild方法接受一个节点对象作为参数，将其作为最后一个子节点，插入当前节点。该方法的返回值就是插入文档的子节点
        
        // hasChildNodes方法返回一个布尔值，表示当前节点是否有子节点

        // cloneNode方法用于克隆一个节点。它接受一个布尔值作为参数，表示是否同时克隆子节点。它的返回值是一个克隆出来的新节点


        // insertBefore方法用于将某个节点插入父节点内部的指定位置
        // insertBefore方法接受两个参数，第一个参数是所要插入的节点newNode，第二个参数是父节点parentNode内部的一个子节点referenceNode。newNode将插在referenceNode这个子节点的前面。返回值是插入的新节点newNode。

        // removeChild方法接受一个子节点作为参数，用于从当前节点移除该子节点。返回值是移除的子节点

        // replaceChild方法用于将一个新的节点，替换当前节点的某一个子节点
        // replaceChild方法接受两个参数，第一个参数newChild是用来替换的新节点，第二个参数oldChild是将要替换走的子节点。返回值是替换走的那个节点oldChild
    </script>
</body>

</html>